<template>
  <div>
    <h2>demo11-component09.vue，将组件作为参数</h2>
    <h3>方式一：</h3>
    <component v-bind:is="MyComponent"></component>
    <h3>方式二：</h3>
    <MyComponent></MyComponent>
    <h3>方式三：</h3>
    <MyComponent3></MyComponent3>
  </div>
</template>
<script>
  import { createApp } from 'vue';
  const app= createApp({
    el:'#app',
    data: function(){
      return {
        message:"hello world"
      }
    }
  })
app.component('MyComponent3',{
  template: `<p class="active">我是自定义组件，是在main.js全局注册的!</p>`
});
export default {
  name:"demo10-component09",
  data(){
    return {
      MyComponent:() => import('./demo10-component09-children01.vue')
    }
  },
  setup(props, context){
  },
  methods:{
  },
}
</script>
<style scoped>

</style>
